{literal}<div id="extruderLeft" class="a {title:'User'}">
    {/literal}
<div id="login_panel">
    Login:
    {if $u->id <=0}
    <form id="login_form" action="index.php">
    <a href="index.php?controller=users&action=fb_authenticate">FB Login</a><br>
    <label>Username</label>
    <input type="text" id="login_user" name="user">
    <label>Password</label>
    <input type="password" id="login_pass" name="pass">
    <input type="button" id="login_button" value="Login">
    </form>
    {else}
    Hi {$u->username}

    {include file="`$smarty.const.BASE`framework/modules/users/views/users/user_menu.tpl"}
    {/if}
    </div>
</div>

{literal}
<script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery("#login_button").click(function(){
        _user=jQuery("#login_user").val();
        _pass=jQuery("#login_pass").val();
            jQuery.ajax({
                type: "POST",
                url: "index.php",
                data: { controller: "login", action: "login", ajax_action:1,username:_user ,password:_pass}
            })
            .done(function( msg ) {
                if(msg=='ok')
                {
                     jQuery("#login_panel").html('Hi '+_user+'<a href="/index.php?controller=login&action=logout">Logout</a>');
                }
                else
                {
                    alert(msg);
                }
            });
        });
        
        $("#login_form input[type=text]").keypress(function (e) {
    if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
        $('#login_button').click();
        return false;
    } else {
        return true;
    }
    });
    });
    $("#extruderLeft").buildMbExtruder({
        position:"right",
        width:300,
        extruderOpacity:.8,
        hidePanelsOnClose:false,
        accordionPanels:false,
        onExtOpen:function(){$('#login_user').focus()},
        onExtContentLoad:function(){$("#extruderLeft").openPanel();},
        onExtClose:function(){}
    });


</script>
{/literal}